<template>
  <div class="OthersShare">
            <img class="tx" :src="`http://localhost:3010/images/${portrait}`" alt="">
            <div class="personShare_right">
              <h3>{{nickname}}</h3>
              <p>&nbsp;&nbsp;&nbsp;&nbsp;{{content}}</p>
              <img :src="`http://localhost:3010/images/${img1}`" alt="">
              <img :src="`http://localhost:3010/images/${img2}`" alt="">
              <p value-format="yyyy-MM-dd">{{ptime}}</p>
            </div>
    </div> 
</template>

<script>
  export default {
    props:['portrait','nickname','ptime','content','img1','img2'],
    methods:{

    }
  }
  
</script>

<style lang="scss" scoped>
.OthersShare{
    display: flex;
    flex-direction: row;
    padding-top: 10px;
    padding-left: 20px;
    .tx{
      width: 50px;
      height: 50px;
      border-radius: 50%;
    }
    .personShare_right{
      padding-left: 20px;
      line-height: 35px;
      h3{
        margin-bottom: 5px;
      }
      p{
        line-height: 20px;
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        margin-bottom: 5px;
      }
      img{
        margin-right: 5px;
        width: 100px;
        height: 100px;
      }
    }
  }
</style>